<template>
  <div class="work_sheet_procedure_manage">
    <one-title title="工单工序管理" @refreshData="refresh"></one-title>
    <mes-search :searchList="searchList"
                ref="mesSearch"
                :searchResult="searchResult"
                @searchInfo="_info">
    </mes-search>
    <div class="table_container">
      <el-table
        :data="listData.list"
        border
        stripe
        v-loading="isLoading"
        style="width: 100%"
        @sort-change="_sort"
        @selection-change="handleSelectionChange">
        <el-table-column
          prop="workorderNumber"
          label="工单编号"
          align="center"
          sortable="custom"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="workstageNumber"
          label="工序编号"
          align="center"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="sort"
          label="工序序号"
          align="center"
          sortable="custom"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="workstageName"
          label="工序名称"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="workorderTecProcNumber"
          label="工艺规程编号"
          align="center"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="estimateEffort"
          label="定额工时"
          align="center"
          show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{scope.row.estimateEffort ? scope.row.estimateEffort + 'h' : ''}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="assignRule"
          label="派工规则"
          align="center"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="evaluator"
          label="估工人员"
          align="center"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="remarks"
          :resizable="false"
          label="工序描述"
          align="left"
          show-overflow-tooltip>
        </el-table-column>
      </el-table>
    </div>
    <mes-pagination
      @updateData="init"
      :currentPage="listData.pageNo"
      :total="listData.count || 0"
      :pageSize="listData.pageSize">
    </mes-pagination>
  </div>
</template>

<script>

export default {
  name: 'WorkSheetProcedureManage',
  data() {
    return {
      // 数据加载中
      isLoading: true,
      // 搜索列表数据
      searchData: {},
      // 搜索结果数
      searchResult: NaN,
      // 排序字段
      sortData: {}
    }
  },
  computed: {
    // 列表数据
    listData() {
      return this.$store.state.workSheetProcedureMan.listData
    },
    // 搜索的字段
    searchList() {
      let searchList = [
        {
          label: '工单编号',
          value: '',
          name: 'workorderNumber',
          type: 'input'
        },
        {
          label: '工序编号',
          value: '',
          name: 'workstageNumber',
          type: 'input'
        },
        {
          label: '工序序号',
          value: '',
          name: 'sort',
          type: 'input'
        },
        {
          label: '工序名称',
          value: '',
          name: 'workstageName',
          type: 'input'
        },
        {
          label: '工艺规程编号',
          value: '',
          name: 'workorderTecProcNumber',
          type: 'input'
        },
        {
          label: '派工规则',
          value: '',
          name: 'assignRule',
          type: 'input'
        },
        {
          label: '估工人员',
          value: '',
          name: 'evaluator',
          type: 'input'
        }
      ]
      return searchList
    }
  },
  components: {
  },
  mounted() {
    this.init()
  },
  methods: {
    // 刷新方法
    refresh() {
      this.$refs.mesSearch.clean()
      this.searchData = {}
      this.sortData = {}
      this.init({
        pageNo: 1,
        pageSize: 15
      })
    },
    // 初始化方法
    init(page) {
      this.isLoading = true
      let pageObj = {
        pageNo: page ? page.pageNo : 1,
        pageSize: page ? page.pageSize : 15
      }
      let postData = {
        method: 'post',
        url: 'a/workorderworkstage/workorderWorkstage/list',
        data: {
          pageNo: pageObj.pageNo,
          pageSize: pageObj.pageSize,
          query: {
            delFlag: 0
          }
        },
        module: 'workSheetProcedureMan',
        state: 'listData'
      }
      if (Object.keys(this.sortData).length > 0) {
        postData.data.sort = this.sortData
      }
      if (Object.keys(this.searchData).length > 0) {
        postData.data.query = this.searchData
      }
      this.$store.dispatch('saveData', postData).then((res) => {
        if (Object.keys(this.searchData).length > 0) {
          this.searchResult = res.count
        } else {
          this.searchResult = NaN
        }
      }).finally(() => {
        this.isLoading = false
      })
    },
    // 查询
    _info(data) {
      this.searchData = data
      this.init()
    },
    // 复选框选中的数据
    handleSelectionChange(val) {
      this.selectData = val
      this.editState = this.selectData.length > 1
    },
    // 排序
    _sort(obj) {
      this.sortData = this.$getSortOrder(obj)
      this.init()
    }
  }
}
</script>

<style scoped lang="less">

</style>
